<template>
  <div id="shareMv">
    <van-button
      @click="showShare = true"
      icon="guide-o"
      size="mini"
      type="default"
      >分享{{ shareCount | comTotal }}</van-button
    >
    <van-popup
      v-model="showShare"
      position="bottom"
      closeable
      close-icon-position="top-left"
      round
      :style="{ height: '20%' }"
      ><share :config="config" @click="sharenum" class="share"></share
    ></van-popup>
  </div>
</template>

<script>
import 'vue-social-share/dist/client.css'
export default {
  name: 'ShareMv',
  data () {
    return {
      showShare: false,
      config: {
        url: 'http://paiwap.hoer.top/video/' + this.$route.params.mvid,
        disabled: [
          'google',
          'facebook',
          'twitter',
          'diandian',
          'linkedin',
          'douban',
          'tencent'
        ]
      }
    }
  },
  props: {
    shareCount: {
      type: [Number, String],
      required: true
    }
  },
  // 定义方法
  methods: {
    sharenum () {}
  }
}
</script>

<style scoped lang="less">
/deep/ .van-popup {
  overflow: unset;
  .share {
    position: absolute;
    bottom: 30px;
    display: flex;
    justify-content: space-evenly;
    width: 100%;

    a {
      width: 50px;
      height: 50px;
      font-size: 30px;
      line-height: 50px;
    }
  }
}
</style>
